<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>

    <link rel="stylesheet" type="text/css" href="../../css/style.css" media="all">
    <link rel="stylesheet" type="text/css" href="../css/common.css" media="all">
    <style type="text/css">
        .lhv1 {
            line-height: 150%;
        }

        .lhv2 {
            line-height: 1.5;
        }
        .lhv3{
            line-height: 1.5em;
        }
        .wrap{
            font-size: 12px;
        }
        .content{
            font-size: 12px;
        }
        .content p{
            font-size: 24px;
        }
    </style>
</head>
<body>
<div class="wrap2 m10a tsG">
    <div class="p10">
        <h2 class="title">
            line-height:150%:先计算，再继承
        </h2>
        <span class="description">
            先计算，再继承： <br>
            即p所在的行，lineHeight为：12px*150%=24px;
        </span>

        <div class="content lhv1">
            <p>test contents</p>
            <p>test contents</p>
            <p>test contents</p>
            <p>test contents</p>
        </div>
        <p class="blank10"></p>

        <h2 class="title">
            line-height:1.5:先继承，再计算
        </h2>
        <span class="description">
            先继承，再计算 <br>
            p所在的lineHeight:24px * 1.5=36px;
        </span>
        <div class="content lhv2">
            <p>test contents</p>
            <p>test contents</p>
            <p>test contents</p>
            <p>test contents</p>
        </div>

        <p class="blank10"></p>
        <h2 class="title">
            line-height:1.5:先继承，再计算
        </h2>
        <span class="description">
            先继承，再计算 <br>
            p所在的lineHeight:24px * 1.5=36px;
        </span>
        <div class="content lhv3">
            <p>test contents</p>
            <p>test contents</p>
            <p>test contents</p>
            <p>test contents</p>
        </div>
    </div>
</div>

</body>
</html>